<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:fragment="head(title)">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title th:replace="${title}">前台公共代码段</title>
    <link rel="stylesheet" th:href="@{/css/style.css}">
    <link rel="stylesheet" th:href="@{/lib/layui/css/layui.css}">
</head>
<body>
<!-- 导航栏 -->
<ul th:fragment="nav(item)" class="layui-nav m-pl-sm m-pr-sm" lay-filter="">
    <img th:src="@{/favicon.ico}" width="20px">
    <a th:href="@{/}" class="logo">
        &nbsp;挚夕影院
    </a>
    <li class="layui-nav-item" th:classappend="${item == 1} ? 'layui-this' : ''"><a th:href="@{/}"><i
            class="layui-icon layui-icon-home">&nbsp;</i>首页</a></li>
    <li class="layui-nav-item" th:classappend="${item == 2} ? 'layui-this' : ''"><a th:href="@{/movie}"><i
            class="layui-icon layui-icon-windows">&nbsp;</i>电影</a></li>
    <li class="layui-nav-item" th:classappend="${item == 3} ? 'layui-this' : ''"><a th:href="@{/cinema}"><i
            class="layui-icon layui-icon-link">&nbsp;</i>影院</a></li>
<!--    <li class="layui-nav-item" th:classappend="${item == 4} ? 'layui-this' : ''"><a th:href="@{/top}"><i-->
<!--            class="layui-icon layui-icon-tabs">&nbsp;</i>榜单</a></li>-->
    <span style="display: inline-block; width: 60%;">
            <div style="display: flex; padding-left: 20px;">
                <input type="text" name="title" required lay-verify="required" placeholder="找电影、影院"
                       autocomplete="off"
                       class="layui-input" id="input-search" style="width: 300px;">
                <button id="searchBtn" class="layui-btn" lay-submit lay-filter="formDemo"><i
                        class="layui-icon layui-icon-search">&nbsp;</i></button>
            </div>
        </span>

    <li th:if="${session.user != null}" class="layui-nav-item" style="text-align: right!important;">
        <a href="#"><img th:src="@{/images/me.jpg}" class="layui-nav-img"></a>
        <dl class="layui-nav-child">
            <dd><a th:href="@{/user/space}">个人中心</a></dd>
            <dd><a th:href="@{/logout.do}">退出</a></dd>
        </dl>
    </li>
    <li th:if="${session.user == null}" class="layui-nav-item" style="text-align: right!important;">
        <a href="#"><img th:src="@{/images/me.jpg}" class="layui-nav-img"></a>
        <dl class="layui-nav-child">
            <dd><a th:href="@{/login}">登录</a></dd>
        </dl>
    </li>
</ul>

<!--js-->
<th:block th:fragment="script">
    <script th:src="@{/lib/jquery-3.7.0.min.js}"></script>
    <script th:src="@{/lib/layui/layui.js}"></script>
    <script>
        $(function (){
            $("#searchBtn").click(function (){
                layer.msg('功能未开发')
            })
        })
    </script>
</th:block>
</body>
</html>